import React, { Component } from 'react';
import { List } from 'antd-mobile'
import { BankcardOutline } from 'antd-mobile-icons'
// import {store} from '../../store/index';
import { connect } from 'react-redux'

class Mine extends Component {

    handelclick() {
        this.props.history.push('/collect')
    }


    render() {
        return (
            <div className='mine'>
                <div className='imgbox'></div>
                <main>
                    <div className='m_top'>
                        <ul>
                            <li onClick={() => { this.handelclick() }}>
                                <span>{this.props.collectlist.length}</span>
                                <span>收藏</span>
                            </li>
                            <li>
                                <span>0</span>
                                <span>积分</span>
                            </li>
                            <li>
                                <span>0</span>
                                <span>优惠券</span>
                            </li>
                        </ul>
                    </div>
                    <div className='m_bot'>
                        <List.Item arrow extra='查看全部订单'>我的订单</List.Item>
                        <dl>
                            <dt>
                                <BankcardOutline style={{ fontSize: 30 }} />
                                <span>待付款</span>
                            </dt>
                            <dt>
                                <BankcardOutline style={{ fontSize: 30 }} />
                                <span>待发货</span>
                            </dt>
                            <dt>
                                <BankcardOutline style={{ fontSize: 30 }} />
                                <span>已发货</span>
                            </dt>
                            <dt>
                                <BankcardOutline style={{ fontSize: 30 }} />
                                <span>待评价</span>
                            </dt>
                        </dl>
                    </div>
                    <div className='m_vip'>
                        <List.Item arrow>会员中心</List.Item>
                    </div>
                    <List mode='card'>
                        <List.Item arrow>领券中心</List.Item>
                        <List.Item arrow>我的评价</List.Item>
                        <List.Item arrow>收货地址</List.Item>
                        <List.Item arrow>我的客服</List.Item>
                    </List>
                </main>
            </div>
        );
    }
}

export default connect(
    (state) => { //将store中的数据注入到组件属性中（props）
        return {
            collectlist: state.collectlist
        }
    }, (dispatch) => {//将dispatch以防法的形式 注入到组件属性中（props）
        return {
           
        }
    })(Mine);